<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/Reset.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/dianying.css">
    <link rel="stylesheet" href="https://at.alicdn.com/t/font_2583483_ajqylvdhlrb.css">
    <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css">
</head>

<body>
    <div class="swiper-container">
        <div class="swiper-wrapper">
            <div class="swiper-slide"><img class="pc100" src="images/top.png"></div>
            <div class="swiper-slide"><img class="pc100" src="https://static.maizuo.com/v5/upload/b43a16925b3c56107bec4b866a2623ca.jpg"></div>
        </div>
        <!-- 如果需要分页器 -->
        <div class="swiper-pagination"></div>
    </div>
    <div class="list pt-15 bg-fff" id="list">
        <div class="item flex jc-sb" >
            <img class="img ml-10" src="${item.poster}">
            <div class="t-box flex fdc jc-sa">
                <div><span> ${item.name}</span><span class="q-box f14 ml-5">${item.filmType}</span></div>
                <div class="f12"><span>观众评分：${item.grade}</span></div>
                <div class="f12">${item.actorStr}</div>
                <div class="f12">${item.nation};${item.runtime}</div>
            </div>
            <span class="buy mr-10 flex aic jc-c">购票</span>
        </div>
        </div>
    </div>
    <div class="bottom bg-fff fixed flex jc-sa aic">
        <a href="dianying.html" class="a-bottom c-fa16 flex fdc jc-c aic">
            <span class="iconfont icon-yingshi2"></span>
            <span>电影</span>
        </a>
        <a href="yingyuan.html" class="a-bottom color flex fdc jc-c aic">
            <span class="iconfont icon-yingyuan"></span>
            <span>影院</span>
        </a>
        <a href="tehui.html" class="a-bottom flex fdc jc-c aic">
            <span class="iconfont c-031 icon-552cd1d5a6521"></span>
            <span class="c-031">特惠</span>
        </a>
        <a href="wode.html" class="a-bottom color flex fdc jc-c aic">
            <span class="iconfont icon-wode"></span>
            <span>我的</span>
        </a>
    </div>
    <script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
    <script>        
        var mySwiper = new Swiper ('.swiper-container', {
          loop: true, // 循环模式选项
          
          // 如果需要分页器
          pagination: {
            el: '.swiper-pagination',   
          },
        })        
        </script>
</body>
<script src="js/index.js"></script>

</html>